import React, { Component } from 'react'
import { Menu, Switch } from 'antd';
// import { Menu } from 'antd';
// import { MailOutlined, AppstoreOutlined, SettingOutlined } from '@ant-design/icons';
import { NavLink } from 'react-router-dom';
//
import { fillterRouter } from '../components/filterRouter'
//引入路由表信息
import routes from '../router/page'
// const { SubMenu } = Menu;
export default class Left extends Component {
    state = {
        theme: 'dark',
        current: '1',
        // list: [
        //     {
        //         name: '热点',
        //         path: '/app/shop'
        //     }
        //     ,
        //     {
        //         name: '话题',
        //         path: '/app/shop'
        //     }
        //     ,
        //     {
        //         name: '生活',
        //         path: '/app/list'
        //     }
        //     ,
        //     {
        //         name: '睡眠',
        //         path: '/app/list'
        //     }
        //     ,
        //     {
        //         name: '个人和用户信息管理',
        //         path: '/app'
        //     }
        //     ,
        //     {
        //         name: '我的订单管理',
        //         path: '/app'
        //     }
        // ]
    };

    changeTheme = value => {
        this.setState({
            theme: value ? 'dark' : 'light',
        });
    };

    handleClick = e => {
        console.log('click ', e);
        this.setState({
            current: e.key,
        });
    };

    render() {
        // console.log(routes[2].children);

        // const { list } = this.state
        const list = fillterRouter(routes[1].children, sessionStorage.getItem('auth'))

        return (
            <>
                <Switch
                    checked={this.state.theme === 'dark'}
                    onChange={this.changeTheme}
                    checkedChildren="Dark"
                    unCheckedChildren="Light"
                />
                <h1>后台管理系统</h1>
                {/* <br /> */}
                {/* <br /> */}
                <Menu
                    theme={this.state.theme}
                    onClick={this.handleClick}
                    // style={{ width: 238, height: 700 }}
                    style={{ width: 238},{height:700}}
                    // style={{ width: 238 }}
                    // style={{ height: 700 }}
                    defaultOpenKeys={['sub2', 'sub5']}
                    selectedKeys={[this.state.current]}
                    mode="inline"
                >
                    {/* <h1>后台管理系统</h1> */}

                    {
                        list.length && list.map((item, idx) => {
                            return <Menu.Item key={idx + 1}>
                                <NavLink to={item.path}>
                                    {item.name}
                                </NavLink>
                            </Menu.Item>
                        })
                    }
                </Menu>
            </>
        );
    }
}
